<template>
  <div class="activitiesTwoPro">
    <div class="proul" v-if="(productdata.length>0 && env === 'production')|| env === 'edit'">
      <active-item
        :buttonActive="TwoproductStyle == 'E' ?  null : buttonActive.bind(this,val) "
        :itemType="TwoproductStyle" v-for="(val,index) in productdata" :key="index"
        :detail="val"></active-item>
      <div v-if='TwoproductStyle===2' style="height: 2.5rem;line-height: 2.5rem;">请配置样式数据</div>
      <div v-if="productdata.length==0 && env === 'edit'" style="height: 2.5rem;line-height: 2.5rem;">暂无数据</div>
      <div style="clear: both;"></div>
    </div>
  </div>

</template>

<script>
  import {getPageNameOrVirtualPageName} from "../../utils/getPageName";
  import {queryGoodsList} from '@/utils/ReturnAxios'
  import ActiveItem from '../ActiveItem'
  export default {
    props: {
      goodsInfo: {
        type: Array,
        default: () => []
      },
      twoproid: {
        type: String,
        default: ""
      },
    },
    data() {
      return {
        codeList: [],
        productdata: [],
        isOnLoad: true,
      }
    },
    components: {
      ActiveItem
    },
    methods: {
      goodsCodearrey() {
        this.codeList = []
        this.productdata = []
        if (this.goodsInfo.length == 0) {
          return
        }
        if (this.goodsInfo && this.goodsInfo.length > 0) {
          for (var i = 0; i < this.goodsInfo.length; i++) {
          	this.productdata.push(this.goodsInfo[i].goodsNewVO)
            //this.codeList.push(this.goodsInfo[i].goodsCode)
          }
          this.getdetaildata()
          //this.queryDetail()
        }
      },
      async queryDetail() {
      	this.isOnLoad = true
        var goodscodeList = this.codeList
        if (goodscodeList.length == 0) {
          return
        }
        var config = {
          goodscodeList: goodscodeList
        }
        var res = await queryGoodsList(config)
        res = res.data
        this.productdata = res.data[0]
        this.isOnLoad = false
        this.getdetaildata()
        if (!res.returnCode) {
          return
        }
      },
      getdetaildata() {
        for (var i = 0; i < this.goodsInfo.length; i++) {
          for (var j = 0; j < this.productdata.length; j++) {
            if (this.goodsInfo[i].goodsCode == this.productdata[j].goodsCode) {
              this.productdata[j].mainPic = this.goodsInfo[i].publicityPicture
              this.productdata[j].regularTypeLabel = this.goodsInfo[i].relTitle
            }
          }
        }
      },
      buttonActive(val){
        this.$router.push({
          path: 'detail?code=' + val.goodsCode
        })
      }
    },
    computed: {
      pageName() {
        return getPageNameOrVirtualPageName();
      },
      TwoproductStyle() {
        if (this.twoproid) {
          if (parseInt(this.getCurrentVDO(this.twoproid, this.pageName).config.TwoproductStyle) == 0) {
            return 'E';
          } else if (parseInt(this.getCurrentVDO(this.twoproid, this.pageName).config.TwoproductStyle) == 1) {
            return 'H';
          } else if (parseInt(this.getCurrentVDO(this.twoproid, this.pageName).config.TwoproductStyle) == 2) {
            return 'I';
          }else{
          	return 2
          }
        }
      },
      env() {
				return window.environment; // 获取是否是编辑状态
			},
    },

    watch: {
      goodsInfo() {
        this.goodsCodearrey()

      },
    },
    mounted() {
      this.goodsCodearrey()
    },
  }
</script>

<style>
  .activitiesTwoPro .proul {
    padding: 0.75rem;
    position: relative;
  }
</style>
